<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>iPad页面</title>
		<link rel="stylesheet" type="text/css" href="css/cube.css"/>
		<link rel="stylesheet" type="text/css" href="css/iconfont.css"/>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		
		<script src="js/jquery-1.12.4.min.js" type="text/javascript"></script>
		<script src="js/init.js" type="text/javascript"></script>
		<script src="js/bootstrap.min.js" type="text/javascript"></script>
	</head>
	<body>
<!--	nav-->
	<nav class="navbar navbar-inverse">
  		<div class="container">
  		  <ul class="head">
  			<li><a href="index.html"><span class="iconfont">&#xe602;</span></a></li>
  			<li><a href="mac.html">Mac</a></li>
  			<li><a href="#" style="opacity:0.65;">iPad</a></li>
  			<li><a href="iPhone.html">iPhone</a></li>
  			<li><a href="watch.html">Watch</a></li>
  			<li><a href="music.html">Music</a></li>
  			<li><a href="#">技术支持</a></li>
  			<li><a href="#"><span class="iconfont">&#xe601;</span></a></li>
  			<li id="gou"><a href="#"><span class="iconfont">&#xe60c;</span></a></li>
  		  </ul>
  		</div>
	</nav>
	
<!--head-->
	<header>
		<div class="shopping">
			<div class="sanjiao"></div>
			<p>你的购物袋是空的</p>
			<ul>
				<li><a href="#"><img src="images/bag.svg"/ style="margin-right:10px;">购物袋</a></li>
				<li><a href="#"><img src="images/favorites.svg"/ style="margin-right:10px;">收藏</a></li>
				<li><a href="#"><img src="images/orders.svg"/ style="margin-right:10px;">订单</a></li>
				<li><a href="#"><img src="images/account.svg"/ style="margin-right:10px;">账户</a></li>
				<li><a href="#"><img src="images/signIn.svg"/ style="margin-right:10px;">登录</a></li>
			</ul>
		</div>
		<div class="container mini">
		<ul class="picture">
			<li><a href=""><img src="images/ipadpro.svg"/><br/>
				<span>iPad Pro</span></a></li>
			<li><a href=""><img src="images/ipadair.svg"/><br/>
				<span>iPad Air 2</span></a></li>
			<li><a href=""><img src="images/ipadmini.svg"/><br/>
				<span>iPad mini 4</span></a></li>
			<li><a href=""><img src="images/ipadmini.svg"/><br/>
				<span>iPad mini 2</span></a></li>
			<li><a href=""><img src="images/ipad.svg"/><br/>
				<span>iOS 10</span></a></li>
			<li><a href=""><img src="images/ipad_acc.svg"/><br/>
				<span>配件</span></a></li>
			<li><a href=""><img src="images/ipad_comp.svg"/><br/>
				<span>机型比较</span></a></li>
		</ul>
		</div>
	</header>
<!--主体-->
<!--第一张图-->
	<div class="page1">
			<h1>iPad Pro</h1>
			<h2>你的下一台电脑，<br>现更以两种尺寸呈现。</h2>
			<p><a href="#">进一步了解</a>&nbsp;&gt;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">购买&gt;</a></p>
			<img src="images/ipadpro.jpg"/>
		<div class=pencil>
			<h3>Apple&nbsp;Pencil<br><span style="font-weight:300;">为 iPad Pro 而来</span></h3>
			<p><a href="#">进一步了解</a>&nbsp;&gt;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">购买&gt;</a></p>
		</div>
			<div class="item1">
				<img src="images/pencil.jpg"/>
			</div>
			<div class="smart">
				<h3>Smart Keyboard<br><span style="font-weight:300;">为 iPad Pro 而来</span></h3>
				<p><a href="#">进一步了解</a>&nbsp;&gt;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">购买&gt;</a></p>
			</div>
		<div class="item2">
			<img src="images/keyboard.png"/>
		</div>
		<div class="help">
			<h2><strong>上百万款为 iPad 而来的 App。</strong></h2>
			<p>你的 iPad 内置有多款强大 app 来帮你处理各种日常事务。而 App Store 中更有上百万款精<br>
			彩 app，均为 iPad 宽大精美的 Retina 显示屏而设计。你喜欢做的事，几乎都有相应的 iPad <br>app 能帮到你。</p>
			<p><a href="#" style="color:#0070c9;">访问APP&nbsp;Store&gt;</a></p>
			<img src="images/apps.jpg"/>
		</div>
	</div>
<!--第二张图-->
	<div class="page2">
		<div class="items2">
			<img src="images/ipadair.jpg"/>
		</div>
		<div class="iPadAir">
			<h2>iPad Air 2</h2>
			<h1>一身轻，更举重若轻。</h1>
			<p><a href="#">进一步了解</a>&nbsp;&gt;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">购买&gt;</a></p>
		</div>
	</div>

<!--第三张图-->
	<div class="page3">
		<h1>iPad mini 4</h1>
		<h2>小身型，大有身手。</h2>
		<p><a href="#">进一步了解</a>&nbsp;&gt;&nbsp;&nbsp;&nbsp;&nbsp;<a href="#">购买&gt;</a></p>
		<img src="images/ipadmini.jpg"/>
	</div>
	
<!--第四张图-->
	<div class="page4">
		<img src="images/icon.png"/>
		<h1>更个性，更强大，也更有乐趣。</h1>
		<p>在 iOS 10 上，你喜欢做的各种事情都会变得更生动、更有趣、更富表<br>现力。</p>
		<p><a href="#">进一步了解</a></p>
		<img src="images/ios10.png"/>
	</div>
	
<!--第五张图-->
	<div class="page4" style="padding-bottom:94px;">
		<h1>iPad 机型比较。</h1>
		<p><a href="#">找到适合你的iPad&nbsp;&gt;</a></p>
		<img src="images/compare_large.png"/ style="margin-top:81px;">
	</div>	

<!--第六张图-->
	<div class="pickup" style="background:#fff;">
		<div class="container">
			<div class="row">
				<div class="col-lg-6">
					<img src="images/pickup.png"/>
					<h3>前往零售店</h3>
					<p>到 Apple Store 零售店亲身体验各种 Apple 产品，<br/>我们还将为你解答相关问题。</p>
					<span><a href="#">进一步了解&gt;</a></span>
				</div>
				<div class="col-lg-6">
					<img src="images/shipping.png"/>
					<h3>免费送货</h3>
					<p>享受免费送货上门服务。</p>
					<span><a href="#">进一步了解&gt;</a></span>
				</div>
			</div>
		</div>
	</div>

<!--第六张图-->
	<div class="page5">
			<h1>iPad 配件</h1>
			<h2>众多出色工具，助你充分发掘 iPad 的精彩。</h2>
			<p><a href="#" style="color:#0070c9;">选购iPad配件&nbsp;&gt;</a></p>
	</div>

<!--第七张图-->
	<div class="page6" style="background:url(images/education_large.jpg);">
		<div class="items5">
			<h1>iPad 教育应用</h1>
			<h2>在课堂上大大转变学习、授课和创造的方式。</h2>
			<p><a href="#" style="color:#fff;">进一步了解iPad教育应用&nbsp;&gt;</a><br>
				<a href="#" style="color:#fff;">教育选购&nbsp;&gt;</a>
			</p>
		</div>
	</div>
	
<!--第八张图-->
	<div class="page6" style="background:url(images/business_large.jpg);">
		<div class="items5">
			<h1>iPad 商务应用</h1>
			<h2>多种多样的可能性，让你的工作方式从此大不相同。</h2>
			<p><a href="#" style="color:#fff;">进一步了解iPad商务应用&nbsp;&gt;</a><br>
				<a href="#" style="color:#fff;">商务选购&nbsp;&gt;</a>
			</p>
		</div>
	</div>
	
<!--第九张图-->
	<div class="page6" style="background:url(images/workshop_large.jpg);">
		<div class="items5">
			<h1>参加店内免费讲座，<br>发掘 iPad 的无限精彩。</h1>
			<h2>报名参加 Apple Store 零售店内的操作技巧讲座，学习基础知识，提高你<br>的 iPad 使用技能。</h2>
			<p><a href="#" style="color:#fff;">查找你附近的讲座&nbsp;&gt;</a>
			</p>
		</div>
	</div>

<!--footer-->
<footer>
	<div class="container buy">
		<h4 class="iconfont">&#xe602;&nbsp;&gt;&nbsp;iPad</h4>
		<div class="row">
			<div class="col-lg-2">
				<h3>选购及了解</h3>
				<ul>
					<li><a href="#">Mac</a></li>
					<li><a href="#">iPad</a></li>
					<li><a href="#">iPhone</a></li>
					<li><a href="#">Watch</a></li>
					<li><a href="#">Music</a></li>
					<li><a href="#">iTunes</a></li>
					<li><a href="#">iPod</a></li>
					<li><a href="#">配件</a></li>
					<li><a href="#">APP&nbsp;Store充值卡</a></li>
				</ul>
			</div>
			<div class="col-lg-3" style="padding-left:30px;">
				<h3>Apple Store 商店</h3>
				<ul>
					<li><a href="#">查找零售店</a></li>
					<li><a href="#">Genius Bar 天才吧</a></li>
					<li><a href="#">讲座和学习</a></li>
					<li><a href="#">青少年活动</a></li>
					<li><a href="#">Apple Store App</a></li>
					<li><a href="#">翻新和优惠</a></li>
					<li><a href="#">分期付款</a></li>
					<li><a href="#">重复使用和循环利用</a></li>
					<li><a href="#">订单状态</a></li>
					<li><a href="#">选购帮助</a></li>
				</ul>
			</div>
			<div class="col-lg-2">
				<h3>教育与应用</h3>
				<ul>
					<li><a href="#">Apple 与教育</a></li>
					<li><a href="#">高校师生选购</a></li>
				</ul>
				<h3>商务应用</h3>
				<ul>
					<li><a href="#">Apple 与商务</a></li>
					<li><a href="#">商务选购</a></li>
				</ul>
			</div>
			<div class="col-lg-2">
				<h3>账户</h3>
				<ul>
					<li><a href="#">管理你的Apple ID</a></li>
					<li><a href="#">Apple store账户</a></li>
					<li><a href="#">iCloud.com</a></li>
				</ul>
				<h3>Apple 价值观</h3>
				<ul>
					<li><a href="#">辅助功能</a></li>
					<li><a href="#">环境责任</a></li>
					<li><a href="#">隐私</a></li>
					<li><a href="#">供应商责任</a></li>
				</ul>
			</div>
			<div class="col-lg-2">
				<h3>关于Apple</h3>
				<ul>
					<li><a href="#">Apple资讯</a></li>
					<li><a href="#">工作机会</a></li>
					<li><a href="#">媒体资讯</a></li>
					<li><a href="#">活动</a></li>
					<li><a href="#">联系Apple</a></li>
				</ul>
			</div>	
		</div>
		<p>更多选购方式：前往<a href="#"> Apple Store</a> 零售店，致电 400-666-8800 或查找在你附近的<a href="#">授权经销商</a>。</p>
		<div class="privice" style="margin-bottom:25px;">
			<span style="color:#888;margin-right:30px;">Copyright © 2017 Apple Inc. 保留所有权利。</span>
			<a href="#">隐私政策</a>
			<a href="#">使用条款</a>
			<a href="#">销售政策</a>
			<a href="#">法律信息</a>
			<a href="#">网站地图</a>
			<span style="float:right;"><a href="#" style="border:0;padding:0;margin:0;"><img src="images/16.png"/>&nbsp;中国</a></span>
		</div>
	</div>
</footer>
	<!-- <div type="button" style="position:fixed;right:0;bottom:0;">
		<a href="#top" style="text-decoration: none;">返回顶部</a>
	</div> -->
	<script src="js/text.js" type="text/javascript"></script>
	</body>
</html>
